<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Meta tag Keywords -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8"/>
    <meta name="keywords"
          content="Modish Login Form Responsive Widget,Login form widgets, Sign up Web forms , Login signup Responsive web form,Flat Pricing table,Flat Drop downs,Registration Forms,News letter Forms,Elements"
    />
    <script>
        addEventListener("load", function () {
            setTimeout(hideURLbar, 0);
        }, false);

        function hideURLbar() {
            window.scrollTo(0, 1);
        }
    </script>
    <!-- Meta tag Keywords -->

    <!-- css files -->
    <link rel="stylesheet" href="css/login/style.css" type="text/css" media="all"/>
    <!-- Style-CSS -->
    <link rel="stylesheet" href="css/login/fontawesome-all.css">
    <!-- Font-Awesome-Icons-CSS -->
    <!-- web-fonts -->
    <!--    <link href="//fonts.googleapis.com/css?family=Tangerine:400,700" rel="stylesheet">-->
    <!--    <link href="//fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i" rel="stylesheet">-->
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>HzSparrow后台管理系统</title>
	<script src="js/jquery/jquery-3.4.1.min.js"></script>
    <script src="js/root.js"></script>
    <script src="js/login.js"></script>
    <script src="js/jquery/extends/jquery-extends-serializeObject.js"></script>
    <link rel="stylesheet" href="js/layui/css/layui.css">
    <script src="js/layui/layui.all.js"></script>
    <!--    <link rel="stylesheet" href="css/login.css">-->

</head>
<body>
<!-- title -->
<!-- //title -->
<!-- content -->
<div class="sub-main-w3">
    <form id="loginForm" class="login" action="#" method="post">
        <fieldset>
            <p class="legend">欢迎登录</p>
            <div class="input">
                <input type="text" placeholder="账号" name="account" required/>
                <span>
                    <i class="fas fa-envelope"></i>
                </span>
            </div>
            <div class="input">
                <input type="password" placeholder="密码" name="password" required/>
                <span>
                    <i class="fas fa-lock-open"></i>
                </span>
            </div>
            <button type="button" class="submit" onclick="loginManager.login();">
                <i class="fas fa-sign-in-alt"></i>
            </button>
        </fieldset>
        <div class="feedback">
            登录成功
        </div>
    </form>
</div>
<!-- //content -->

<!-- copyright -->
<div class="footer">
    <h2>
        <a href="http://www.beian.miit.gov.cn">冀ICP备19026997号</a>
    </h2>
</div>
<!-- //copyright -->
<!-- //Jquery -->
<!-- script -->
<script type="application/javascript">
    $(".input").focusin(function () {
        $(this).find("span").animate({
            "opacity": "0"
        }, 200);
    });

    $(".input").focusout(function () {
        $(this).find("span").animate({
            "opacity": "1"
        }, 300);
    });

    $(".login").submit(function () {
        $(this).find(".submit i").removeAttr('class').addClass("fa fa-check").css({
            "color": "#fff"
        });
        $(".submit").css({
            "background": "#2ecc71",
            "border-color": "#2ecc71"
        });
        $(".feedback").show().animate({
            "opacity": "1",
            "bottom": "-80px"
        }, 400);
        $("input").css({
            "border-color": "#2ecc71"
        });
        return false;
    });
    document.body.addEventListener('keyup', function (e) {
        if (e.keyCode == '13') {
            loginManager.login();
        }
    })
</script>
<!-- //script -->

</body>
</html>